var successDialog;
var failDialog;

$(document).ready(function(){

	$(document).keydown(function(event){ 
		if(event.keyCode == 13){ //绑定回车 
			$('#search').click(); 
		} 
	}); 

	successDialog = dialog({
		content: '操作成功！',
	});

	failDialog = dialog({
		content: '操作失败！',
		okValue: '确定',
		ok: function () {
			this.close();
		}
	});

	$(".form_datetime").datetimepicker({
		format : "dd MM yyyy - HH:ii P",
		showMeridian : true,
		autoclose : true,
		todayBtn : true
	});

	var queryParams = function(params){
		params.name = $("#username").val();
		params.age = $("#age").val();
		return params;
	}

	$(".table_list").bootstrapTable({
	url: 'user/list',
	contentType: 'application/x-www-form-urlencoded',
	method: 'GET',
	height: '600',
	striped: true,//条纹
	pagination: true,//显示分页
	pageNumber: 1,//首页页码
	pageList: [20,50,100],
	sidePagination:'server',//服务器分页
	singleSelect: true,//单选
	strictSearch: true,//设置为 true启用 全匹配搜索，否则为模糊搜索
	queryParams: queryParams,
	queryParamsType: '',
	showColumns: true,//是否显示 内容列下拉框
	showRefresh: false,//是否显示 刷新按钮
	showToggle: false,//是否显示 切换试图（table/card）按钮
	searchOnEnterKey: true,//设置为 true时，按回车触发搜索方法，否则自动触发搜索方法
	clickToSelect: true,//设置true 将在点击行时，自动选择rediobox 和 checkbox
	toolbar: "#toolbar",
	onLoadError:function(code,data){
	var d = dialog({
	title: '提示',
	content: '列表加载异常，请联系程序猿！',
	okValue: '确定',
	ok: function () {
	d.close();
	},
	});
	d.show();
	},
	columns:[
	{
	field: "id",
	title: "ID",
	align: "center",
	valign: "middle",
	visible:false,
	},{
	field: "name",
	title: "姓名",
	align: "center",
	valign: "middle",
	},{
	field: "code",
	title: "code码",
	align: "center",
	valign: "middle",
	},{
	field: "address",
	title: "地址",
	align: "center",
	valign: "middle",
	},{
	field: "likes",
	title: "喜好",
	align: "center",
	valign: "middle",
	},{
	field: "age",
	title: "年龄层次",
	align: "center",
	valign: "middle",
	formatter: function(value){
	if(Number(value) < 18){
	return '未成年';
	}else{
	return '已成年';
	}
	}
	},{
	field: "action",
	title: "操作",
	align: "center",
	valign: "middle",
	formatter : function(value,row,index){
	var html = "<button type='button' class='btn btn-primary' onclick='showUserEdit("+row.id+")'>编辑</button>"
	html += "&nbsp;&nbsp;&nbsp;&nbsp;"
	html += "<button type='button' class='btn btn-success' onclick='showRoleEdit("+row.id+")'>配置角色</button>"
	return html;
	}
	}
	]
	});
//	$(".table_list").bootstrapTable({
//		url: 'user/list',
//		contentType: 'application/x-www-form-urlencoded',
//		method: 'GET',
//		striped: true,
//		pagination: true,//显示分页
//		pageNumber: 1,//首页页码
//		pageList: [20,50,100],
//		sidePagination:'server',//服务器分页
//		singleSelect: true,//单选
//		strictSearch: true,//设置为 true启用 全匹配搜索，否则为模糊搜索
//		queryParams: queryParams,
//		queryParamsType: '',
//		showColumns: true,//是否显示 内容列下拉框
//		showRefresh: false,//是否显示 刷新按钮
//		showToggle: false,//是否显示 切换试图（table/card）按钮
//		searchOnEnterKey: true,//设置为 true时，按回车触发搜索方法，否则自动触发搜索方法
//		clickToSelect: true,//设置true 将在点击行时，自动选择rediobox 和 checkbox
//		toolbar: "#toolbar",
//		columns:[
//			[
//				{
//					field:'name',
//					title: "销售",
//					valign:"middle",
//					align:"center",
//					colspan: 1,
//					rowspan: 3
//				},{
//					title: "销售部门",
//					valign:"middle",
//					align:"center",
//					colspan: 1,
//					rowspan: 3
//				},{
//					title: "7月个人有效业绩",
//					valign:"middle",
//					align:"center",
//					colspan: 3,
//					rowspan: 1
//				},{
//					title: "8月个人有效业绩",
//					valign:"middle",
//					align:"center",
//					colspan: 3,
//					rowspan: 1
//				},{
//					title: "9月个人有效业绩",
//					valign:"middle",
//					align:"center",
//					colspan: 3,
//					rowspan: 1
//				},{
//					title: "本季度销售任务合计",
//					valign:"middle",
//					align:"center",
//					colspan: 1,
//					rowspan: 3,
//				},{
//					title: "本季度不计提成额合计",
//					valign:"middle",
//					align:"center",
//					colspan: 1,
//					rowspan: 3,
//				},{
//					title: "本季度有效业绩合计",
//					valign:"middle",
//					align:"center",
//					colspan: 1,
//					rowspan: 3,
//				}
//				],
//				[
//					{
//						title: "PCB",
//						valign:"middle",
//						align:"center",
//						colspan: 2,
//						rowspan: 1
//					},
//					{
//						title: "非PCB",
//						valign:"middle",
//						align:"center",
//						colspan: 1,
//						rowspan: 2
//					},
//					{
//						title: "PCB",
//						valign:"middle",
//						align:"center",
//						colspan: 2,
//						rowspan: 1
//					},
//					{
//						title: "非PCB",
//						valign:"middle",
//						align:"center",
//						colspan: 1,
//						rowspan: 2
//					},
//					{
//						title: "PCB",
//						valign:"middle",
//						align:"center",
//						colspan: 2,
//						rowspan: 1
//					},
//					{
//						title: "非PCB",
//						valign:"middle",
//						align:"center",
//						colspan: 1,
//						rowspan: 2
//					}
//					],
//					[
//						{
//							title: '新品',
//							valign:"middle",
//							align:"center",
//							
//						},
//						{
//							title: '老品',
//							valign:"middle",
//							align:"center",
//						},{
//							title: '新品',
//							valign:"middle",
//							align:"center",
//						},
//						{
//							title: '老品',
//							valign:"middle",
//							align:"center",
//						},
//						{
//							title: '新品',
//							valign:"middle",
//							align:"center",
//						},
//						{
//							title: '老品',
//							valign:"middle",
//							align:"center",
//						}
//						]
//			]
//	});

	var errorDialog = dialog({
		title: '提示',
		content: '请求失败！',
		okValue: '确定',
		ok: function () {
			this.close().remove();
		}
	});

	$('#search').click(function(){
		$(".table_list").bootstrapTable('refresh');
	}); 

	$('#reset').click(function(){
		$(".table_list").bootstrapTable('refresh');
	});

});

function showUserEdit(id){
	$.get("user/detail",{"id":id},function(data,status){
		if(status != 'success'){
			errorDialog.show();
		}else{
			if(data.result){
				var html = `
					<form role="form">
					<div class="form-inline">
					<label for="name">名称</label>
					<input type="text" class="form-control" value="`+data.userInfo.name+`" id="name" placeholder="请输入修改后姓名">
					</div>
					<div class="form-inline">
					<label for="code">编码</label>
					<input type="text" class="form-control" value="`+data.userInfo.code+`" id="code" placeholder="请输入修改后编码">
					</div>
					<div class="form-inline">
					<label for="age">年龄</label>
					<input type="text" class="form-control" value="`+data.userInfo.age+`" id="userage" placeholder="请输入修改后年龄">
					</div>
					<div class="form-inline">
					<label>喜好</label>
					<div class="checkbox">
					<label><input type="checkbox" name="like" value="篮球" >篮球</label>
					<label><input type="checkbox" name="like" value="足球">足球</label>
					<label><input type="checkbox" name="like" value="乒乓球">乒乓球</label>
					<label><input type="checkbox" name="like" value="棒球">棒球</label>
					</div>
					<div class="form-inline">
					<input name="" id="citySelect"  type="text"  class="city_input" readonly="readonly">
					</div>
					</div>
					</form>
					`;
				dialog({
					title: '提示',
					content: html,
					okValue: '修改',
					ok: function () {
						var chk_value =[]; 
						$('input[name="like"]:checked').each(function(){ 
							chk_value.push($(this).val()); 
						});
						var jsonMsg = {
								"id":id,
								"name":$('#name').val(),
								"code":$('#code').val(),
								"age":$('#userage').val(),
								"address":$('#citySelect').val(),
								"likes":chk_value.toString()
						}
						console.info(jsonMsg);
						$.ajax({
							url:"user/edit",
							data:JSON.stringify(jsonMsg),
							contentType:"application/json;charset=utf-8",
							type:"post",
							success:function(data,status){
								if(status != 'success'){
									errorDialog.show();
								}else if(data.result){
									successDialog.show();
									$(".table_list").bootstrapTable('refresh');
									setTimeout(function () {
										successDialog.close();
									}, 1500);
								}else{
									failDialog.show();
								}
							}
						});
					}
				}).show();
				init_city_select($("#citySelect"));
				console.info(data.userInfo.address);
				$("#citySelect").val(data.userInfo.address);
				var likes = data.userInfo.likes;
				if(likes != '' && likes != null){
					var arr = likes.split(",");
					$("input[name='like']").each(function(){
						if(
								$.inArray($(this).val(), arr) != -1
						){
							$(this).attr("checked",true);
						}
					});
				}
			}else{
				dialog({
					title: '提示',
					content: '用户信息获取失败！',
					okValue: '确定',
					ok: function () {
						this.close().remove();
					}
				})
			}
		}
	})
}